<template>
	<view class="app">
		<uni-card v-for="m in myAddrList">
			<uni-row>
				<uni-col :span="6" :offset="3">
					<view style="font-size: 30rpx;font-weight: bold;">{{m.addressName}}</view>
				</uni-col>
				<uni-col :span="8">
					{{m.addressTel}}
				</uni-col>
			</uni-row>
			<uni-row>
				<uni-col :span="18" :offset="3">
					<view style="margin-top: 10rpx;">{{m.province+" "+m.city+" "+m.county+" "+m.detail}}</view>
				</uni-col>
				<uni-col :span="3">
					<uni-icons type="compose" size="50rpx"></uni-icons>
				</uni-col>
			</uni-row>
		</uni-card>
		<uni-row>
			<uni-col :span="24">
				<view class="bar">
					<button style="background-color: #00d583;color: white;width: 700rpx;border-radius: 30rpx;"
						@click="addAddr()">
						<uni-icons type="plusempty" style="color: white;font-weight: bold;" size="30rpx"></uni-icons>
						新增地址
					</button>
				</view>
			</uni-col>
		</uni-row>


	</view>
</template>

<script>
	export default {
		data() {
			return {
				myAddrList: []
			}
		},
		methods: {
			queryMyAddr() {
				uni.request({
					url: 'api/custom-server/queryAddrByUserId',
					header: {
						"token": "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJ6eU1hbmFnZSI6eyJpZCI6IjE4MjA3NzkzMTgxODg1NzY3NjgiLCJtYW5hZ2VBY2NvdW50IjoiY2oiLCJtYW5hZ2VOaWNrTmFtZSI6ImNqIn19.AI1W3jxpA1T1k438YI8weWTw_51jKU2uUQAjKKJ3Rig"
					},
					success: (res) => {
						if (res.data.code == 200) {
							this.myAddrList = res.data.data;

						}
					}
				})
			},
			addAddr() {
				uni.navigateTo({
					url: '/pages/myAddr/addAddr'
				})
			},
			// back(m){
			// 	uni.navigateTo({
			// 		var addr = JSON.stringify(m);
			// 		url:'/pages/payOrder/payOrder?addr='+addr
			// 	})
			// }
		},
		onLoad() {
			this.queryMyAddr()
		},
		created() {
			this.queryMyAddr()
		}
	}
</script>

<style>
	.app {
		position: relative;

	}

	.bar {
		margin-top: 700rpx;
		position: fixed;
		z-index: 1000;
		/* 确保 bar 在其他元素之上 */
		display: flex;
		// width: 100%;
		text-align: center;
	}
</style>